<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
 <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="css/style.css"/>
        <link href="assets/css/codemirror.css" rel="stylesheet">
        <link rel="stylesheet" href="assets/css/ace.min.css" />
        <link rel="stylesheet" href="font/css/font-awesome.min.css" />
        <style>
            .Ads_list{margin-left:0;}
            #edit_ads_style{
                    padding: 15px;
            }
            #edit_ads_style .label_name{
                width:80px;
                text-align:right;
                font-size:14px;
                float:left;
            }
            #edit_ads_style .edit_adverts li {
                height: 32px;
                line-height: 30px;

                margin: 10px 0px;
            }


        </style>
        <!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
		<script src="js/jquery-1.9.1.min.js"></script>
		<script src="assets/js/typeahead-bs2.min.js"></script>
        <script src="js/lrtk.js" type="text/javascript" ></script>
		<script src="assets/js/jquery.dataTables.min.js"></script>
		<script src="assets/js/jquery.dataTables.bootstrap.js"></script>
        <script src="assets/layer/layer.js" type="text/javascript" ></script>
        <script type="text/javascript" src="Widget/swfupload/swfupload.js"></script>
        <script type="text/javascript" src="Widget/swfupload/swfupload.queue.js"></script>
        <script type="text/javascript" src="Widget/swfupload/swfupload.speed.js"></script>
        <script type="text/javascript" src="Widget/swfupload/handlers.js"></script>
<title>广告管理</title>
<script>

        var advList = null;

            function queryAll(){
                $.ajax({
                        url:"advertising/advQueryAll.php",
                        type:"post",
                        data:"",
                        datatype:"json",
                        success:function(data){
                            advList = data;
                            var len = advList.length;
                            var domlist = "";
                            for(let i=0;i<len;i++){
                                let value = advList[i];
                                domlist+="<tr>";
                                domlist+= '<td><label><input type="checkbox" class="ace" data-index="'+value['id']+'"><span class="lbl"></span></label></td>';
                                domlist+= '<td>' +value["id"] + '</td>';
                                domlist+= '<td>' +value["ban_name"] + '</td>';
                                domlist+= '<td><span class="ad_img"><img src="'+value["ban_url"]+'" width="100%" height="100%" /></span></td>';
                                domlist+= '<td><a href="'+value["ban_url"]+'" target="_blank">'+value["ban_url"]+'</a></td>';
                                domlist+= '<td>' +value["ban_createtime"] + '</td>';
                                if(value['ban_isshow']==1){
                                    domlist+= '<td class="td-status"><span class="label label-success radius">显示</span></td>';
                                }else if(value['ban_isshow']==0){
                                    domlist+= '<td class="td-status"><span class="label label-danger radius">隐藏</span></td>';
                                }
                                domlist+= '<td class="td-manage" >'+
                                          '<a title="编辑"  href="javascript:;"  class="btn btn-xs btn-info" data-index="'+value['id']+'"><i class="fa fa-edit bigger-120" ></i></a>'+
                                          '<a title="删除" href="javascript:;"   class="btn btn-xs btn-warning" data-index="'+value['id']+'" ><i class="fa fa-trash  bigger-120" ></i></a>'+
                                         '</td>';
                                domlist+= "</tr>";
                            }
                            $("#sample-table").find("tbody").eq(0).html(domlist);
                        },
                    });
            }
    </script>
</head>

<body>
    <div class=" clearfix" id="advertising">
    <div id="scrollsidebar" class="left_Treeview">
        <div class="show_btn" id="rightArrow"><span></span></div>
    </div>
  </div><div class="Ads_list">
   <div class="border clearfix">
       <span class="l_f">
        <a href="javascript:;" id="ads_add" class="btn btn-warning"><i class="fa fa-plus"></i> 添加广告</a>
        <a href="javascript:;" class="btn btn-danger"><i class="fa fa-trash"></i> 批量删除</a>
       </span>
       <span class="r_f">共：<b>45</b>条广告</span>
     </div>
     <div class="Ads_lists">
       <table class="table table-striped table-bordered table-hover" id="sample-table">
		<thead>
		 <tr>
				<th width="25"><label><input type="checkbox" class="ace"><span class="lbl"></span></label></th>
				<th width="80">ID</th>
				<th width="80">名字</th>
				<th width="220px">图片</th>
				<th width="250px">链接地址</th>
				<th width="180px">加入时间</th>
				<th width="70px">状态</th>
				<th width="250px">操作</th>
			</tr>
		</thead>
	<tbody>

    </tbody>
    </table>
     </div>
 </div>
</div>
<!--添加广告样式-->
<div id="add_ads_style"  style="display:none">
 <div class="add_adverts">
 <form id="form_add">
 <ul>
     <li>
         <label class="label_name">名&nbsp;&nbsp;称：</label>
         <input type="text" name="pname" style="width:250px" />
     </li>

     <li><label class="label_name">文&nbsp;&nbsp;件：</label><span class="cont_style"><input name="file" type="file" accept="image/png, image/jpeg" multiple /></span></li>
     <li><label class="label_name">状&nbsp;&nbsp;态：</label>
         <span class="cont_style">
             &nbsp;&nbsp;<label><input name="isshow" type="radio" checked="checked" class="ace" value="1"><span class="lbl">显示</span></label>&nbsp;&nbsp;&nbsp;
             <label><input name="isshow" type="radio" class="ace" value="0"><span class="lbl">隐藏</span></label></span>
         <div class="prompt r_f"></div>
     </li>
 </ul>
 </form>
 </div>
</div>

<!--编辑广告样式-->
<div id="edit_ads_style"  style="display:none">
 <div class="edit_adverts">
 <form id="form_edit">
 <ul>

     <li>
         <label class="label_name">名&nbsp;&nbsp;称：</label>
         <input type="text" name="pname" style="width:250px" />
     </li>

     <li><label class="label_name">文&nbsp;&nbsp;件：</label><span class="cont_style"><input name="file" type="file" accept="image/png, image/jpeg" multiple /></span></li>
     <li><label class="label_name">状&nbsp;&nbsp;态：</label>
         <span class="cont_style">
             &nbsp;&nbsp;<label><input name="isshow" type="radio" checked="checked" class="ace" value="1"><span class="lbl">显示</span></label>&nbsp;&nbsp;&nbsp;
             <label><input name="isshow" type="radio" class="ace" value="0"><span class="lbl">隐藏</span></label></span>
         <div class="prompt r_f"></div>
     </li>
     <li><input type="hidden" name = "id"></input></li>
 </ul>
 </form>
 </div>
</div>

</body>
</html>
<script>
//初始化宽度、高度
 $(".widget-box").height($(window).height());
 $(".Ads_list").width($(window).width()-220);
  //当文档窗口发生改变时 触发
    $(window).resize(function(){
	$(".widget-box").height($(window).height());
	 $(".Ads_list").width($(window).width()-220);
	});
	$(function() {
	$("#advertising").fix({
		float : 'left',
		//minStatue : true,
		skin : 'green',
		durationTime :false,
		stylewidth:'220',
		spacingw:30,//设置隐藏时的距离
	    spacingh:250,//设置显示时间距
		set_scrollsidebar:'.Ads_style',
		table_menu:'.Ads_list'
	});
});
/*广告图片-停用*/
function member_stop(obj,id){
	layer.confirm('确认要关闭吗？',{icon:0,},function(index){
		$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="显示"><i class="fa fa-close bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已关闭</span>');
		$(obj).remove();
		layer.msg('关闭!',{icon: 5,time:1000});
	});
}
/*广告图片-启用*/
function member_start(obj,id){
	layer.confirm('确认要显示吗？',{icon:0,},function(index){
		$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-success" onClick="member_stop(this,id)" href="javascript:;" title="关闭"><i class="fa fa-check  bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">显示</span>');
		$(obj).remove();
		layer.msg('显示!',{icon: 6,time:1000});
	});
}
/*广告图片-删除*/
function member_del(obj,id){
	layer.confirm('确认要删除吗？',{icon:0,},function(index){
		$(obj).parents("tr").remove();
		layer.msg('已删除!',{icon:1,time:1000});
	});
}
/*******添加广告*********/
 $('#ads_add').on('click', function(){
	  layer.open({
        type: 1,
        title: '添加广告',
		maxmin: true,
		shadeClose: false, //点击遮罩关闭层
        area : ['800px' , ''],
        content:$('#add_ads_style'),
		btn:['提交','取消'],
		yes:function(index,layero){
		console.log(document.getElementById("form_add"));
		var formdata = new FormData(document.getElementById("form_add"));
		    $.ajax({
		        url:"advertising/advUpload.php",
// 		        async: false,//同步上传
                cache: false,//上传文件无需缓存
                processData: false,  // 不处理数据
                contentType: false, // 不设置内容类型
		        type:"post",
		        datatype:"json",
		        data:formdata,
		        success:function(data){
                    console.log(data);
                    layer.open({
                        title:"添加成功"
                    });
                    queryAll();
		        },
		        error:function(e){
		            console.log(e);
		        }
		    });
			layer.close(index);

		}
    });
})
/*******删除广告********* $(this)点击事件仍然是 a 而不是委托对象 */
 $('tbody').eq(0).on('click','.btn-warning',function(event){
    var id = $(this).data("index");
	  layer.open({
        type: 0,
        title: '删除广告',
        content:"你确定要删除吗？",
		btn:['提交','取消'],
		yes:function(index,layero){
		    $.ajax({
		        url:"advertising/advDel.php",
		        type:"post",
		        datatype:"json",
		        data:{
		            id:id
		        },
		        success:function(data){
		            console.log(data);
                    layer.open({
                        title:"提示",
                        content:data.msg
                    });
                    queryAll();
		        },
		        error:function(e){
		            console.log(e);
		        }
		    });
			layer.close(index);

		}
    });
});


/*******编辑广告*********/
 $('tbody').eq(0).on('click','.btn-info', function(){
    var id = $(this)[0].dataset.index;
     $.ajax({
                url:"advertising/advQueryOne.php",
                type:"post",
                datatype:"json",
                data:{
                    id:id
                },
                success:function(data){
                     $("#form_edit").find("input[type='text']")[0].value=data[0].ban_name;
                     var radios  = $("#form_edit").find("input[type='radio']");
                     for(let i = 0;i<radios.length;i++){
                        if(data[0].ban_isshow == radios[i].value){
                            $("#form_edit").find("input[type='radio']")[i].checked = true;
                            break;
                        }
                     }
                     $("#form_edit").find("input[type='hidden']")[0].value=data[0].id;
                },
                error:function(e){
                    console.log(e);
                }
            });
	  layer.open({
        type: 1,
        title: '编辑广告',
		maxmin: true,
		shadeClose: false, //点击遮罩关闭层
        area : ['800px' , ''],
        content:$('#edit_ads_style'),
		btn:['提交','取消'],
		yes:function(index,layero){
            console.log(document.getElementById("form_edit"));
            var formdata = new FormData(document.getElementById("form_edit"));
		    $.ajax({
		        url:"advertising/advEdit.php",
// 		        async: false,//同步上传
                cache: false,//上传文件无需缓存
                processData: false,  // 不处理数据
                contentType: false, // 不设置内容类型
		        type:"post",
		        datatype:"json",
		        data:formdata,
		        success:function(data){
                    console.log(data);
                    layer.open({
                        title:"编辑成功",
                        content:data.msg
                    });
                    queryAll();
		        },
		        error:function(e){
		            console.log(e);
		        }
		    });
			layer.close(index);

		}
    });
})


</script>
<script type="text/javascript">
function updateProgress(file) {
	$('.progress-box .progress-bar > div').css('width', parseInt(file.percentUploaded) + '%');
	$('.progress-box .progress-num > b').html(SWFUpload.speed.formatPercent(file.percentUploaded));
	if(parseInt(file.percentUploaded) == 100) {
		// 如果上传完成了
		$('.progress-box').hide();
	}
}

function initProgress() {
	$('.progress-box').show();
	$('.progress-box .progress-bar > div').css('width', '0%');
	$('.progress-box .progress-num > b').html('0%');
}

function successAction(fileInfo) {
	var up_path = fileInfo.path;
	var up_width = fileInfo.width;
	var up_height = fileInfo.height;
	var _up_width,_up_height;
	if(up_width > 120) {
		_up_width = 120;
		_up_height = _up_width*up_height/up_width;
	}
	$(".logobox .resizebox").css({width: _up_width, height: _up_height});
	$(".logobox .resizebox > img").attr('src', up_path);
	$(".logobox .resizebox > img").attr('width', _up_width);
	$(".logobox .resizebox > img").attr('height', _up_height);
}

$(document).ready(function() {
    queryAll();
});
</script>
<script>
jQuery(function($) {
        $('table th input:checkbox').on('click' , function(){
            var that = this;
            $(this).closest('table').find('tr > td:first-child input:checkbox')
            .each(function(){
                this.checked = that.checked;
                $(this).closest('tr').toggleClass('selected');
            });

        });
        // 批量删除
        $('a.btn-danger').eq(0).on('click',function(){
            var delList = [];
            $("table").find('tr > td:first-child input:checkbox').each(function(){
                if(this.checked ===true){
                    delList.push(this.dataset.index);
                }
            });
            layer.open({
                title:"警告",
                content:"确认要删除吗？",
                btn:["提交",'取消'],
                yes:function(index,layero){
                    $.ajax({
                        url:"advertising/advMDel.php",
                        type:"post",
                        data:{
                            selectlist:delList
                        },
                        datatype:"json",
                        success:function(data){
                            console.log(data);
                            layer.open({
                                title:"删除成功",
                                content:data.msg
                            });
                            queryAll();
                        },
                        error:function(e){
                            console.log(e);
                        }

                    });
                    layer.close(index);
                }

            });

        });

    })
</script>
